/* layout */
/* 皮肤颜色 */
.theme{

    background: url(../img/header/bg.png);
    color:#fff;

}
.skin{
    background: #01060c;
}
.skin2{
    background: rgba(9,73,109,0.25) !important;
}

/* 头部 */
.header{
    width: 1920px;
    height: 66px;
    line-height: 66px;
    text-align: center;

}

.header-border{
    border-bottom:1px solid #1b1f25;
}

.nav-list{
    width: 684px;
    height: 100%;
}

.nav-item{
    width: calc(100% / 3);
}

.nav--active{
    background: url(../img/header/topnav_bg.png);
}

.nav-list a{
    font-size: 18px;
    color:#b0e9fe;
}

.header-boiler{
    padding-left: 0px;
    font-size: 18px;
    color: #b0e9fe;
    line-height: 30px;
    margin-right:50px;
}
.right-bar a{
    width: 32px;
    height: 32px;
    display:block;
    background:url(../img/header/top_icon.png) no-repeat;
}

.right-bar-time{
    color:#b0e9fe;
    font-size: 14px;
}
.right-bar-role{
    margin-top: 16px;
    border-left:1px solid #1b1f25;
}
.right-bar-help a{
    background-position: 0px 0px;
}
.right-bar-role a{
    background-position: -32px 0px;
}





.main{
    width: 1880px;
}

/* 左侧内容 */
.left-side{
    width: 450px;
}
.right-side{
    width:360px;
}
.input-output{
    width: 100%;
    height: 320px;
}

/* 主内容 */
.main-contain{
    width: 1028px;
}


/* 负责间隙 */
.auto{
    margin:0 auto;
}
.outter-right{
    margin-right: 20px;
}
.outter-top{
    margin-top: 20px;
}
.outter-bottom{
    margin-bottom: 10px;
}
.outter-left{
    margin-left: 20px;
}
.inner-align{
    padding:0 20px;
}
.outter-align{
    margin:0 auto;
}
.inner-top{
    padding-top: 20px;
}

.mr2{
    margin-right: 2px;
}

/* 边框 */
.border{
    border:1px solid #09496d;
}
.highlight-border{
    border:1px solid #0a5884;
}
.common-title{
    color:#00c5f6;
    font-size: 18px;
}
/* 左侧详细内容 */
/* 产用可视化内容 */
.input-output{
    width: 100%;
    height: 264px;
    padding: 20px;
    text-align:center;
}

.product{
    width: calc(100% / 2);
}
.product-title{
    margin-bottom: 20px;
    font-size: 18px;
    line-height: 18px;
    padding-right: 28px;
}
.product-data{
    width: 185px;
    height: 132px;
    background: url(../img/circle_bg.png) left 0;
    margin-bottom: 14px;
    margin-left: 19px;
    position: relative;
    line-height: 132px;
}
.product-data-val{
    width: 132px;
    font-size: 36px;
    color:#14be31;
}
.product-status{
    width: 28px;
    height: 28px;
    background: url(../img/circle_up.png) no-repeat;
    display:block;
    position: absolute;
    right:56px;
    bottom:12px;
}
/*.product-view{
	height: 40px;
	width: 132px;
	margin-left: 19px;
	background: url(../img/test.png);
	background-size:cover;
}*/

.use{
    width: calc(100% / 2);

}
.use-title{
    margin-bottom: 20px;
    font-size: 18px;
    line-height: 18px;
    padding-left: 46px;
}
.use-data{
    width: 185px;
    height: 132px;
    background: url(../img/circle_bg.png) right 0px;
    margin-bottom: 14px;
    position: relative;
    line-height: 132px;
}
.use-data-val{
    width: 132px;
    margin-left: 54px;
    font-size: 36px;
    color:#14be31;
}
.use-status{
    width: 28px;
    height: 28px;
    background: url(../img/circle_up.png) no-repeat;
    display:block;
    position: absolute;
    right:2px;
    bottom:12px;
}
/*.use-view{
	height: 40px;
	width: 132px;
	margin-left: 58px;
	background: url(../img/test.png);
	background-size:cover;
}*/

.product-viewchart{
    width: 100%;
    height: 50px;
}

.unit{
    font-size: 18px;
    color:#b0e9fe;
}



/* 主管压力/放散 */
.pressure-title{
    height: 30px;
    line-height: 30px;

}
.pressure-legend{
    width: 118px;
    height: 20px;
    margin-top: 5px;
    margin-left: 60px;
    margin-right:10px;
    font-size: 12px;
    padding:0 4px;
    line-height: 20px;
    border:1px solid #25333c;
}
.legend-icon{
    width: 14px;
    height: 2px;
    background: url(../img/tips.png) no-repeat;
    margin-left: 2px;
    margin-right: 10px;

}
.legend-des{
    width:calc(100% / 2);
}
.pressure-legend1-icon{
    margin-top: 9px;
    background-position: 0px -1px;
}
.pressure-legend2-icon{
    margin-top: 9px;
    background-position: 0px -2px;
}
.pressure-input{
    width: 138px;
    height: 28px;
    border:1px solid #0a5984 ;
    padding-left: 10px;
    position:relative;
}
.pressure-input-text{
    color:rgba(176,233,254,0.6);
    background: url(../img/dropdown_arrow.png) no-repeat right center;
}
.pressure-input-list{
    position: absolute;
    left:0;
    top:28px;
    width: 138px;
    background: #01060a;
    border:1px solid #0a5984;
    z-index:1;
    -display:none;
}
.pressure-input-item{
    padding-left: 10px;
    border-bottom:1px solid #0a5984;
    color:rgba(176,233,254,0.6);
}
.pressure-input-item:hover{
    color:rgba(176,233,254,1);
}
.pressure-content{
    width: 100%;
    height: 258px;
}

.pressure-data{
    width: 100%;
    height: 50px;
    border-bottom:1px solid #08486c;
    line-height: 50px;
    text-align: center;
}
.pressure-data-item{
    width: calc(100% / 2);
    height: 50px;
}
.pressure-data-item-border{
    border-right:1px solid #08486c;
}
.pressure-data-item-all{
    font-size: 24px;
    color:#14be31;
}
.pressure-data-item-percent{
    font-size: 24px;
    color:#fe3b2f;
}
.pressure-chart{
    width: 100%;
    height: 208px;
    padding: 10px;
}
/*  本班绩效*/
.gas-title{
    height: 30px;
    line-height: 30px;
}
.gas-legend{
    width: 180px;
    height: 12px;
    line-height: 12px;
    font-size: 12px;
    margin-left: 162px;
    margin-top: 10px;
}
.gas-legend-des{
    width: calc(100% / 2);
}
.gas-legend-icon{
    width: 12px;
    height: 12px;
}
.gas-legend1-icon{
    background-position: -1px -3px;
}
.gas-legend2-icon{
    background-position: -29px -3px;
}
.gas-legend3-icon{
    background-position: -29px -3px;
}
.gas-content{
    width: 100%;
    height: 203px;
    padding-left:2px;
}
.achieve{
    width: 115px;
}
.achieve-poe{
    height: 30px;
    font-size: 14px;
    font-weight: bold;
    color: #b0e9fe;
    text-align: center;
    line-height:30px;
    position: relative;
    background: #0b3951;
    margin-top:2px;
}
.achiev-right{
    width: 12px;
    height: 30px;
    background: url("../img/bg_tip01.png") no-repeat 0 0;
    position: absolute;
    right:-12px;
}
.achieve-lenged{
    color: #b0e9fe;
}
.square{
    display: inline-block;
    margin-right:10px;
    font-size: 12px;
    width: 12px;
    height: 12px;
}
.red{
    background: red;
}
.red-color{
    color:red;
}
.green{
    background: green;
}
.green-color{
    color:green;
}
.achieve-content{
    width: 130px;
    height: 28px;
    font-size: 12px;
    color:#a0d5e9;
}
.achiev-conent-right{
    width: 150px;
    height: 200px;
    padding: 0 10px;
    font-size: 16px;
}
.achiev-right-text{
    width: 100%;
    font-size: 16px;
    color: #b0e9fe;
    padding-bottom:6px;
    border-bottom:1px solid #0b395b;
}
.font16{
    font-size: 16px;
    color: #b0e9fe;
}
.achiev-right-li{
    height:calc(100% / 3);
    width: 100%;
    padding-top:10px;
    text-align: center;
}
.achieve-arrow{
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-left:6px;
    background: url("../img/up.png") no-repeat center center;
}
.mar3{
    margin-left:3px;
}
.mar6{
    margin-left:6px;
}
.mar12{
    margin-right:12px;
}
.mart5{
    margin-top:5px;
}
.mar92{
    margin-top:92px;
}
.marl{
    margin-left:9px;
}
.achieve-num{
    font-size:24px ;
}
.achieve-chart{
    margin-top:43px;
    width: 156px;
    height: 156px;
}
.font16{
    font-size: 16px;
    color: #b0e9fe;
}
.fontnormal-14{
    font-size: 14px;
    color: #14be31;
}
.fontyellow-14{
    font-size: 14px;
    color: yellow;
}

.fontRed-14{
    font-size: 14px;
    color: red;
}
.fontnormal-12{
    font-size: 12px;
    color: #14be31;
}
.fontyellow-12{
    font-size: 12px;
    color: yellow;
}
.fontRed-12{
    font-size: 12px;
    color: red;
}
.font12{
    font-size: 12px;
    color: #b0e9fe;
}

/* 主内容区 */
.main-container{
    width: 100%;
    height: 584px;
}
.left-chart{
    width: 80%;
    height:100%;
    border-right:1px solid #09496d;
}   
.right-data{
    width: 20%;
    height: 100%;
}

.right-data > p{
    width: 100%;
    height: 50%;
    border-bottom:1px solid #09496d;
    text-align: center;
    padding-top: 30px;
    line-height: 38px;
}
.right-data-current{
    font-size: 18px;
    color: #b0e9fe;
}
.right-data-current .current-data{
    font-size: 30px;
    color: #14be31;
}
.broadcast{
    height: 244px;
    line-height: 30px;
}
.broadcast-font18{
    font-size: 18px;
    color: #00ccfe;
}
.broadcast-font14{
    font-size: 14px;
    color: #00ccfe;
}
.broadcast-mes{
    width: 90px;
    height: 30px;
    line-height:30px;
    text-align: center;
}
.broadcast .active{
    border:1px solid #0a5884;
}
.broadcast a{
    color:#00ccfe;
}
.broadcast-title{

}
.broadcast-content{
    width: 100%;
    height: 204px;
    position: relative;
    margin-top:8px;
}
.font-18{
    font-size: 18px;
    color: #00c5f6;
    height:35px;
    line-height: 35px;
    padding-left:20px;
}
.font-14{
    font-size: 14px;
    color: #b0e9fe;
}
.main-furnace-title{
    margin-left:20px;
    margin-bottom:14px;
    margin-top:35px;
}
.main-content-time{
    width: 138px;
    height: 24px;
    margin-top: 9px;
    margin-right:9px;
}
.pressure-legend-time{
    width: 118px;
    height: 20px;
    margin-top: 14px;
    margin-left: 60px;
    margin-right:10px;
    font-size: 12px;
    padding:0 4px;
    line-height: 20px;
    border:1px solid #25333c;
}
.furance-chart{
    width: 100%;
    height: 256px;
}
/* 表格布局 */
.w200{
    width: 200px;
}
.w100{
    width: 100px;
}
.w120{
    width: 120px;
}
.w514{
    width: 514px;
}
.w80{
    width: 80px;
}
.title-bg{
    background: #0b3951;
}

.title-list{
    padding:2px;
    text-align: center;
    line-height: 30px;
    font-size: 14px;
    border-bottom:1px solid #0b395b;
}

.contents{
    height: 168px;
    width: 1026px;
    text-align: center;
    font-size: 14px;
    color:#b0e9fe;
    overflow:auto;
}
.furnace{
    height:calc(100% / 2) ;
    width: 100%;
}
.bor-bottom{
    border-bottom:1px solid #09496d;
}
.furnace-fir{
    background: #000;
}
.furnace-font{
    font-size: 16px;
}

.furnace-color{
    color:#9bcfe3;
}
.furance-lable{
    width: 60px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    font-size: 14px;
    color:#b0e9fe;
    background: #0b3951;
}
.main-item-data-content {
    width: 300px;
    height: 70px;
    border: 1px solid #0b395b;
    padding-left:5px;
    margin-top: 150px;
    padding-top: 10px;
    background: rgba(11,57,91,0.2);
}
.main-item-data-current{
    width: 90px;
    font-size: 12px;
    color:#b0e9fe;
    padding:0 15px;
}
.main-item-data-red{
    color:red;
}
.main-data-time-current{
    width: 78px;
    font-size: 12px;
    color:#b0e9fe;
}
.main-item-data-current .current-data{
    font-size: 30px;
    color:#14be31;
}
.unit{
    font-size: 16px;
    color:#b0e9fe;
    padding-top: 30px;
    padding-left:15px;
}
.main-data-time{
    padding-top:10px;
    padding-left:20px;
    width:300px;
}
.current-time{
    font-size: 20px;
    color:#14be31;
    line-height: 30px;
}
.main-data-time-press{
    width: 196px;
    font-size: 12px;
    color: #b0e9fe;
}
.main-current-data{
    width: 196px;
    height:14px;
    margin-top:10px;
    border-radius:5px;
    padding:2px;
}
.main-current-data-press{
    width:190px;
    height:8px;
    background: #078d1c;
    border-radius: 5px;
}
.main-data-square{
    display: inline-block;
    margin-right:6px;
    width: 12px;
    height: 12px;
}

.main-data-status{
    width: 100%;
    height: 240px;
}
.main-item-padd{
    height: 26px;
    background: #263e4c;
    padding: 0 10px;
    line-height: 26px;
    font-size: 14px;
}
.main-item-active{
    background: #000;
}
/*图表两种状态图例颜色*/
.main-data-square-org{
    background: #be9654;
}
.main-data-square-sky{
    background: #00ccfe;
}
.main-data-square-Wathet{
    background: #b0e9fe;
}
/* 表格布局 */
.w320{
    width: 320px;
}
.w160{
    width: 160px;
}
.w112{
    width: 112px;
}
.title-bg{
    background: #0b3951;
}
.content-item{
    line-height: 62px;
    border-bottom:2px solid #0b395b;
    border-right:2px solid #0b395b;
}

/*.content-list>li:nth-child(2n){
    background: #0c1e2a;
}*/
.content-prediction{
    padding-top:14px;
    height:62px;
    text-align: left;
}
.content-submessage{
    margin-left:5px;
}
.content-prediction-chart{
    font-size: 12px;
    width: 36px;
    height: 36px;
}
.content-prediction-status{
    height: 36px;
    line-height:18px;
    text-align: left;
}
.content-prediction-value{
    height: 36px;
    line-height:18px;
    text-align: right;
}
.content-item .content-item-tip{
    width: 18px;
    height: 16px;
    display:inline-block;
    background-image: url(../img/samll_icon.png);
}
.content-item-tip-one{
    background-position:-54px 0px;
}
.content-item-tip-two{
    background-position:-72px 0px;
}
.content-operate{
    padding-top: 5px;
    padding-left: 15px;
}
.content-operate-msg{
    display: inline-block;
    width: 18px;
    height: 18px;
    background: url(../img/samll_icon.png);
    margin-right: 10px;
}
.content-operate-close{
    display: inline-block;
    width: 18px;
    height: 18px;
    background: url(../img/samll_icon.png) -20px 0px;
}
/*错峰协同台*/
.input-gas{
    width: 100%;
    height:846px;
}
.main-item-right-content{
    width: 320px;
    height: 50px;
    margin-top: 28px;
}
.main-item-alldata-current{
    width: 150px;
    font-size: 14px;
    color: #b0e9fe;
}
.main-item-alldata-current .current-data{
    font-size: 30px;
    color: #14be31;
}
.main-right-select{
    padding:0 20px;
}
.main-right-select-input{
    height: 24px;
    line-height: 24px;
}
.pressure-all-data{
    width:150px;
}
.pressure-legend-all{
    width:150px;
    height: 20px;
    margin-right:10px;
    font-size: 12px;
    padding:0 8px;
    line-height: 20px;
    border:1px solid #25333c;
}
.legend-des{
    width:calc(100% / 2);
}
.legend-all-icon{
    width: 10px;
    height: 2px;
    background: url(../img/line_tips.png) no-repeat;
    margin-left: 2px;
    margin-right: 5px;
}
.pressure-legend1-all-icon{
    margin-top: 9px;
    background-position: 0px 0px;
}
.pressure-legend2-all-icon{
    margin-top: 9px;
    background-position: -11px 0;
}
.pressure-legend3-all-icon{
    margin-top: 9px;
    background-position: -22px 0;
}
.pressure-legend4-all-icon{
    margin-top: 9px;
    background-position: -33px 0;
}
.pressure-legend5-all-icon{
    margin-top: 9px;
    background-position: -44px 0;
}
.pressure-legend6-all-icon{
    margin-top: 9px;
    background-position: -55px 0;
}
.pressure-legend7-all-icon{
    margin-top: 9px;
    background-position: -66px 0;
}
.pad5{
    padding-right:2px;
}
/*总用气量图表*/
.main-peak-chart{
    width: 100%;
    height:262px;
    overflow:hidden;
}
/*其他高炉信息*/
.main-furnace{
    padding-left:20px;
    padding-right:2px;
    width: 100%;
}
.main-furnace-mess{
    height:70px;
}
.main-data-furnace{
    width: 100px;
    height: 100%;
    line-height: 60px;
}
.main-data-furnace-change{
    text-align: center;
    line-height:35px;
}
.main-data-furnace-msg{
    text-align: right;
    line-height:28px;
    height:100% ;
}

.main-data-furnace-arrow{
    display: inline-block;
    margin-right:18px;
    width: 12px;
    height: 12px;
    background: url("../img/open.png") no-repeat 0 0;
}
.main-data-furnace-arrow1{
    display: inline-block;
    margin-right:18px;
    width: 12px;
    height: 12px;
    background: url("../img/open.png") no-repeat 0 0;
    transform:rotate(-90deg);
    -ms-transform:rotate(-90deg); 	/* IE 9 */
    -moz-transform:rotate(-90deg); 	/* Firefox */
    -webkit-transform:rotate(-90deg); /* Safari 和 Chrome */
    -o-transform:rotate(-90deg); 	/* Opera */
}
.main-data-furnace-user{
    display: inline-block;
    width: 12px;
    height: 12px;
    background: url("../img/self.png") no-repeat 0 0;
}
.furnace-font{
    font-size: 14px;
    color: #13b330;
}
.main-data-furnace-time {
    padding-top: 10px;
    width: 176px;
}
.main-data-furnace-press {
    width: 90px;
    font-size: 12px;
    color: #b0e9fe;
}
.main-data-current-press {
    width: 100px;
    height: 14px;
    margin-top: 10px;
    border-radius: 5px;
    padding: 2px;
}
.main-data-current-val {
    width: 94px;
    height: 8px;
    border-radius: 5px;
}
.current-normal{
    background: #078d1c;
}
.current-abnormal{
    background: rgba(255,0,0,0.5);
}
.main-item-data-range {
    width: 300px;
    height: 70px;
    border: 1px solid #0b395b;
    padding-left:5px;
    margin-top: 10px;
    padding-top: 10px;
    background: rgba(11,57,91,0.2);
}
.main-out-data{
    width: 300px;
    margin-top: 10px;
    margin-left: 22px;
}
.main-furnace-details{
    width: 58px;
    height: 26px;
    background: #069cc1;
    font-size: 14px;
    color: #ffffff;
    text-align: center;
    line-height:26px;
    margin-left:10px;
}
.main-data-furnace-chart {
    width: 100%;
    height: 200px;
}
/*与我相关信息滚动条*/
/*滚动条*/
.contents::-webkit-scrollbar{
    width: 3px;
    height: 0px;
}
/*定义滚动条的轨道，内阴影及圆角*/
.contents::-webkit-scrollbar-track{
    /*-webkit-box-shadow: inset 0 0 6px rgba(255,255,255,0);*/
    border-radius: 10px;
    background-color: rgba(0,0,0,0.8);
    border:1px solid #000;
}
/*定义滑块，内阴影及圆角*/
.contents::-webkit-scrollbar-thumb{
    /*width: 10px;*/
    height: 20px;
    border-radius: 10px;
    /*-webkit-box-shadow: inset 0 0 9px rgba(255,255,255,1);*/
    background-color: #207494;
}
/*自定义横向滚动条*/
.content-prediction{
    min-width: 514px;
}
.content-prediction-scroll{
    width: 514px;
    height:62px;
    overflow: scroll;
    overflow-y: hidden;
}
.content-status{
    width: 514px;
    height: 60px;
}
/*滚动条*/
.content-prediction-scroll::-webkit-scrollbar{
    width: 3px;
    height:5px;
}
/*定义滚动条的轨道，内阴影及圆角*/
.content-prediction-scroll::-webkit-scrollbar-track{
    /*-webkit-box-shadow: inset 0 0 6px rgba(255,255,255,0);*/
    border-radius: 10px;
    background-color: rgba(0,0,0,0);
    -border:1px solid #000;
}
/*定义滑块，内阴影及圆角*/
.content-prediction-scroll::-webkit-scrollbar-thumb{
    /*width: 10px;*/
    height: 20px;
    border-radius: 10px;
    /*-webkit-box-shadow: inset 0 0 9px rgba(255,255,255,1);*/
    background-color: #207494;
}
/*取消框弹出层*/
.conent-list{
    position: relative;
}
.cancel-popup{
    width: 278px;
    height: 118px;
    background: #01060c;
    position: absolute;
    top: 46px;
    left: 667px;
    font-size: 14px;
    padding: 9px;
    line-height: 38px;
}
.can-select{
    width: 188px;
    height: 24px;
    background: #01060c;
}
.can-tip{
    margin-left:70px;
}
.can-button{
    width: 78px;
    height: 24px;
    line-height:24px;
    text-align: center;
    cursor: pointer;
}
.can-icon{
    margin-right:28px;
}
.can-define{
    width: 78px;
    height: 24px;
    line-height:24px;
    text-align: center;
    background: #069cc1;
}
/*修改提示框信息样式*/
.normalfont{
    font-size: 12px;
    color: #b0e9fe;
}
.barChart{
    width: 360px;
    height: 170px;
}

